import Vue from 'vue'
import VueRouter from 'vue-router'
import { Message }from 'element-ui' // 从element-ui引入消息提示组件
import Home from '../views/Home.vue'; // 引入主页组件
import Error404 from "../views/Error404";
import LoginByCode from "../views/LoginByCode.vue";
import News from "../views/news/News.vue";
import CreditLife from "../views/CreditLife/CreditLife.vue";
import UserInformation from "../views/user/UserInformation.vue";
import NewsDetail from "../views/news/NewsDetail.vue";
import Behavior from "../views/Behavior/Behavior.vue";
import Library from "../views/CreditLife/Library.vue";
import LibraryDetail from "../views/CreditLife/LibraryDetail.vue";
import PublicTransportation from "../views/CreditLife/PublicTransportation.vue";
import PublicTransportationDetail from "../views/CreditLife/PublicTransportationDetail.vue";
import Hospital from "../views/CreditLife/Hospital.vue";
import HospitalDetail from "../views/CreditLife/HospitalDetail.vue";
import Parking from "../views/CreditLife/Parking.vue";
import ParkingDetail from "../views/CreditLife/ParkingDetail.vue";
import OrganizerDetail from "../views/Behavior/OrganizerDetail.vue";
import Notice from "../views/Notice/Notice.vue";
import Verification from "../views/user/Verification.vue";
import Products from "../views/CreditBusiness/Products.vue";
import ProductDetail from "../views/CreditBusiness/ProductDetail.vue";
import Houses from "../views/CreditBusiness/Houses.vue";
import HouseDetail from "../views/CreditBusiness/HouseDetail.vue";
import Rooms from "../views/CreditBusiness/Rooms.vue";
import RoomDetail from "../views/CreditBusiness/RoomDetail.vue";
import ActivityDetail from "../views/Behavior/ActivityDetail.vue";


Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    component: LoginByCode, // 默认路由到登录页
    redirect: '/login-code'
  },

  // 验证码登录页路由
  {
    path: '/login-code',
    component: LoginByCode
  },

  // //主页
  // { path: '/home',
  //   component: Home
  // },

  // 信用管理 - 使用我设计的新界面
  {
    path: '/credit-management',
    name: 'CreditManagement',
    component: () => import('@/views/CreditManagement/CreditManagement.vue')
  },

  // 信用生活
  {
    path: '/credit-life',
    name: 'CreditLife',
    component: CreditLife
  },
  // 图书借阅
  {
    path: '/library',
    name: 'Library',
    component: Library
  },
  //图书馆详情页
  {
    path: '/library-detail/:id',
    name: 'LibraryDetail',
    component: LibraryDetail
  },

  // 公交地铁
  {
    path: '/public-transportation',
    name: 'PublicTransportation',
    component: PublicTransportation
  },
  //公交地铁详情页
  {
    path: '/public-transportation-detail/:id',
    name: 'PublicTransportationDetail',
    component: PublicTransportationDetail
  },

  // 舒心就医
  {
    path: '/hospital',
    name: 'Hospital',
    component: Hospital
  },
  // 舒心就医详情页
  {
    path: '/hospital-detail/:id',
    name: 'HospitalDetail',
    component: HospitalDetail
  },

  // 便捷泊车
  {
    path: '/parking',
    name: 'Parking',
    component: Parking
  },
  // 便捷泊车详情页
  {
    path: '/parking-detail/:id',
    name: 'ParkingDetail',
    component: ParkingDetail
  },

  // 信用商业
  {
    path: '/credit-business',
    name: 'CreditBusiness',
    component: ()=> import('@/views/CreditBusiness/CreditBusiness.vue')
  },
  // 商品相关路由
  {
    path: '/credit-business/products',
    name: 'Products',
    component:Products
  },
  {
    path: '/credit-business/product-detail/:id',
    name: 'ProductDetail',
    component: ProductDetail
  },

  // 房屋租赁相关路由
  {
    path: '/credit-business/houses',
    name: 'Houses',
    component: Houses
  },
  {
    path: '/credit-business/house-detail/:id',
    name: 'HouseDetail',
    component: HouseDetail
  },
  // 酒店预订相关路由
  {
    path: '/credit-business/rooms',
    name: 'Rooms',
    component:Rooms
  },
  {
    path: '/credit-business/room-detail/:id',
    name: 'RoomDetail',
    component: RoomDetail
  },
  // 亲社会行为活动
  {
    path: '/behavior',
    name: 'Behavior',
    component: Behavior
  },
  // 亲社会行为活动详情页
  {
    path: '/organizer-detail/:id',
    name: 'OrganizerDetail',
    component: OrganizerDetail
  },
  {
  path: '/activity-detail/:id',
  name: 'ActivityDetail',
  component: ActivityDetail
},

  // 新闻资讯
  {
    path: '/news',
    name: 'News',
    component: News
  },
  //新闻详情页
  {
    path: '/news-detail/:id',
    name: 'NewsDetail',
    component: NewsDetail
  },

  //通知
  {
    path: '/notice',
    name: 'Notice',
    component: Notice
  },

  {
    path: '/user-information',
    name: 'UserInformation',
    component: UserInformation
  },



  {
    path: '/verification',
    name: 'Verification',
    component: Verification
  },

  {
    path: '/*',
    component: Error404 // 匹配不到路由时展示404页面
  }
]

const router = new VueRouter({
  routes,
  mode: 'history' // 使用 HTML5 history 模式
})

//挂载路由导航守卫
router.beforeEach((to, from, next) =>{
  //to 将要访问的路径
  //from 从哪个页面来
  //next 一个放行函数

  if(to.path === '/login' || to.path === '/404') return next();


  //获取token
  const token = window.sessionStorage.getItem("token")



// 白名单，未登录也可访问的页面
  const whiteList = ['/login', '/register', '/reset-password', '/404','/user','/login-code']

  // 放行白名单中的页面
  if (whiteList.includes(to.path)) {
   return next();
  }


  if(!token){
    Message.error('抱歉，请先登录')
    return next('/login-code');
  }//拦截器，注释掉
  next();
} )

// 重写 VueRouter 的 push 方法，避免重复点击同一路由报错
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => err)
}

export default router
